<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>

<%
	String importMsg = "";
	if (request.getSession().getAttribute("msg") != null) {
		importMsg = request.getSession().getAttribute("msg").toString();
	}
	request.getSession().setAttribute("msg", "");
%>

<head>
	<title>欢迎来到图片上传</title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>

<body>
	<!-- 修改，这里如果不用onchange，会出现一个小bug,当你提交后，图片只能变一次 -->
	<input type="file" id="file" style="display:none;" onchange="filechange(event)">
	<img src="" width="200px" height="200px" id="img-change">
	<button id="btn">保存图片</button>
</body>

<script type="text/javascript">

	$("#img-change").click(function () {
    	$("#file").click();
	})
	
	/*$("#file").change(function (event) {*/
	var filechange=function(event){
    	var files = event.target.files, file;
    	if (files && files.length > 0) {
	        // 获取目前上传的文件
	        file = files[0];// 文件大小校验的动作
	        if(file.size > 1024 * 1024 * 2) {
	            alert('图片大小不能超过 2MB!');
	            return false;
	        }
	        // 获取 window 的 URL 工具
	        var URL = window.URL || window.webkitURL;
	        // 通过 file 生成目标 url
	        var imgURL = URL.createObjectURL(file);
	        //用attr将img的src属性改成获得的url
	        $("#img-change").attr("src",imgURL);
	        // 使用下面这句可以在内存中释放对此 url 的伺服，跑了之后那个 URL 就无效了
	        // URL.revokeObjectURL(imgURL);
	    }
	};
	
	$("#btn").click(function () {
        $.ajaxFileUpload({
            url: 'accountInfo/uploadPoster.do',
            fileElementId:'file',
            dataType:'txt',
            secureuri : false,
            success: function (data){
                if(data=="yes"){
                    $("#img-alert").css("display","block");
                }
            },
            error:function(data,status,e){
                alert(e);
            }
        });
    });
	
	/* $("#img-change").change(function(){  
	    var file = this.files[0];  
	        //判断类型是不是图片    
	        if(!/image\/\w+/.test(file.type)){       
	                alert("请确保文件为图像类型");     
	                return false;     
	        }     
	        var reader = new FileReader();     
	        reader.readAsDataURL(file);     
	        reader.onload = function(e){  
	          image_base64=this.result.split(",")[1];  
	           //就是base64   
	          article_image = image_base64;     
	        }  
	  });   */
	
</script>

</html>